<template>
	<view class="container">
		<!-- 板块选择 -->
		<picker v-model="bankuai" :range="class1" mode="selector" class="input-field" @change="gaibiao">
			<view class="picker">
				类型: {{ class1[bankuai] }}
			</view>
		</picker>
		<view class="">
			提示：教育9    娱乐10   美食11   新闻12
		</view>
		
		<!-- 帖子标题输入框 -->
		<input v-model="Tiezi.name" placeholder="请输入帖子标题" class="input-field" />
		<!-- 帖子描述输入框 -->
		<input v-model="Tiezi.desc"   placeholder="请输入帖子描述" class="input-field" />
		<!-- 帖子内容输入框 -->
		<input v-model="Tiezi.content" placeholder="请输入帖子内容" class="input-field" />
		<!-- 封面地址输入框 -->
		<input v-model="Tiezi.coverImage" placeholder="请输入封面图地址" class="input-field" />
		<!-- 提交按钮 -->
		<button @click="send" class="register-button">发布</button>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {addTiezi} from '../../api/luntan.js'
	let bankuai=ref(0)
	let class1=ref([9,10,11,12])
	
	let Tiezi=ref({
		forum:9,
		name:'',
		desc:'',
		content:'',
		coverImage:'',
	})
	async function send(){
	    console.log('**************8',Tiezi.value);
		let r1=await addTiezi(Tiezi.value);
		
		console.log(r1.data);
		uni.switchTab({
			url:'/pages/luntan/luntan'
		})
	}
	function gaibiao(e){
		console.log(e);
		console.log(e.detail.value);
		bankuai.value=e.detail.value
		console.log(bankuai.value);
		console.log(class1.value[bankuai.value]);
		Tiezi.value.forum=class1.value[bankuai.value]
	}
</script>

<style scoped>
	.container {
		padding: 20px;
	}

	.title {
		font-size: 24px;
		font-weight: bold;
		text-align: center;
		margin-bottom: 20px;
	}

	.input-field {
		border: 1px solid #ccc;
		border-radius: 5px;
		padding: 10px;
		margin-bottom: 20px;
	}

	.register-button {
		background-color: #007aff;
		color: white;
		padding: 10px;
		border-radius: 5px;
		text-align: center;
	}

	.picker {
		border: 1px solid #ccc;
		border-radius: 5px;
		padding: 10px;
		margin-bottom: 20px;
		height: 50px;
	}
</style>